const log = console.log.bind(console.log)
let OuterFrame = document.querySelector('.OuterFrame');
let maxpecture = document.querySelector('.maxpecture');
let mixpct = document.querySelectorAll('.mixpct');


//点击大图切换下一张
const dianjiAPI = () => {
    maxpecture.addEventListener('click',function (event){
        let seif = event.target
        if (seif.alt < mixpct.length) {
            let a = Number(seif.alt) + 1
            seif.src = `img/${a}.jpg`
            seif.alt = a
        } else  {
            seif.src = 'img/1.jpg'
            seif.alt = 1
        }
    })
}
//触摸显示图片
const chumoAPI = () => {
    for (let i = 0; i < mixpct.length; i++) {
        mixpct[i].addEventListener('mouseover',function (){
            maxpecture.alt = mixpct[i].alt
            maxpecture.src = mixpct[i].src
        })
    }
}
//轮播图
const run = () => {
    if (maxpecture.alt < mixpct.length) {
        maxpecture.alt++
        maxpecture.src = `img/${maxpecture.alt}.jpg`
    } else {
        maxpecture.alt = 1
        maxpecture.src = 'img/1.jpg'
    }
}
//轮播开始
let a = setInterval(run,1000)
// 进入鼠标停止轮播
const stop = () => {
    OuterFrame.addEventListener('mouseover',function () {
        clearInterval(a)
    })
}
//离开鼠标开始轮播
const play = () => {
    OuterFrame.addEventListener('mouseleave',function () {
        a = setInterval(run,1000)
    })
}
//统一调用端口
const _min = () => {
    play()
    stop()
    chumoAPI()
    dianjiAPI()
}
_min()